<template>
  <view class="comment" v-if="list && list.length > 0">
    <view class="count">共{{list.length}}条评论</view>
    <view class="item" v-for="item in list" :key="item.id">
      <view class="avatar" v-if="item.user">
        <u-avatar :src="item.user.avatar" size="80" v-if="item.user.av * 1 === 0"></u-avatar>
        <u-avatar :src="baseUrl + item.user.avatar" size="80" v-else></u-avatar>
      </view>
      <view class="desc" v-if="item.user">
        <view class="name">{{item.user.nickname}}</view>
        <view class="content">{{item.content}}</view>
        <view class="time">{{item.create_time}}</view>
      </view>
    </view>
  </view>
</template>

<script>
import color from '@/config/color.js'
import config from '../../../config/config'
import base64 from '../../../util/base64'

import Material from '../../../api/material'
const materialModel = new Material()

export default {
  props: ['list'],
  data() {
    return {
      baseUrl: config.baseUrl
    }
  },
  methods: {
    fetch() {
    }
  },
  created() {
    this.fetch()
  }
}


</script>

<style lang="scss" scoped>
.comment {
  //background: red;
  //height: 1000rpx;
  .count {
    font-size: 24rpx;
    margin-bottom: 20rpx;
  }
  .item {
    margin-bottom: 30rpx;
    display: flex;
    align-items: start;
    .avatar {
      padding-right: 20rpx;
    }
    .desc {
      .name {
        margin-bottom: 20rpx;
        font-size: 24rpx;
      }
      .content {
        font-size: 28rpx;
        //font-weight: 700;
      }
      .time {
        font-size: 20rpx;
        color: #999999;
        margin-top: 20rpx;
      }
    }
  }
}
</style>
